<style lang="less">
  #div-truck-load-driver-authentication-info-sy {
    .au-img {
      width: 77%;
      margin: auto;
      background-color: #F2F2F2;
      height: 230px;
    }
    .el-text-align {
      text-align: center;
    }
  }
</style>

<template>
  <div id="div-truck-load-driver-authentication-info-sy">
    <el-form ref="authentication" :model="authentication" label-width="110px">
      <el-row>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="真实姓名">
              <el-input :value="authentication.realName||''"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item prop="driverName" label="身份证号">
              <el-input v-model="authentication.idCardNo"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item prop="driverPhone" label="准驾车型">
              <el-input v-model="authentication.drivingLicenseType"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车牌号">
              <el-input v-model="authentication.plateNumber"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车辆所有人">
              <el-input v-model="authentication.owner" :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车辆类型">
              <el-input v-model="authentication.vehicleType"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车长">
              <el-input v-model="authentication.vehicleLength"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车辆核载">
              <el-input v-model="loadTonAndLoadParty" :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="车辆识别代号">
              <el-input v-model="authentication.frameNo"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <div class="grid-content">
            <el-form-item label="发动机号">
              <el-input v-model="authentication.engineNo"
                        :disabled="true"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row class="f-mt10">
        <el-col :span="12" class="el-text-align">
          <div class="grid-content au-img">
            <img width="100%" height="100%"
                 v-if="authentication!=null&&authentication.idcardFontUrl!=null"
                 v-bind:src="authentication.idcardFontUrl">
            <label
              v-if="authentication==null||authentication.idcardFontUrl==null"
              style="line-height: 230px">待上传照片</label>
          </div>
          <label>身份证人像面照片</label>
        </el-col>
        <el-col :span="12" class="el-text-align">
          <div class="grid-content au-img">
            <img width="100%" height="100%"
                 v-if="authentication!=null&&authentication.idcardBackUrl!=null"
                 v-bind:src="authentication.idcardBackUrl">
            <label
              v-if="authentication==null||authentication.idcardBackUrl==null"
              style="line-height: 230px">待上传照片</label>
          </div>
          <label>身份证国徽面照片</label>
        </el-col>
      </el-row>
      <el-row class="f-mt10">
        <el-col :span="12" class="el-text-align">
          <div class="grid-content au-img">
            <img width="100%" height="100%"
                 v-if="authentication!=null&&authentication.driverLicenseUrl!=null"
                 v-bind:src="authentication.driverLicenseUrl">
            <label
              v-if="authentication==null||authentication.driverLicenseUrl==null"
              style="line-height: 230px">待上传照片</label>
          </div>
          <label>C1及以上驾驶证照片（正页）</label>
        </el-col>
        <el-col :span="12" class="el-text-align">
          <div class="grid-content au-img">
            <img width="100%" height="100%"
                 v-if="authentication!=null&&authentication.drivingLicenseUrl!=null"
                 v-bind:src="authentication.drivingLicenseUrl">
            <label
              v-if="authentication==null||authentication.drivingLicenseUrl==null"
              style="line-height: 230px">待上传照片</label>
          </div>
          <label>行驶证（正页）</label>
        </el-col>
      </el-row>
      <el-form-item>
        <el-button type="primary" class="f-fr" @click="affirmAuditClick"
                   v-if="authentication.auditStatus===107008003||authentication.auditStatus===107008005">
          确认审核
        </el-button>
        <el-button type="primary" class="f-fr f-mr10" @click="createTruckLoadDriverAuthenticationInfoClick"
                   v-if="authentication.auditStatus===107008001||authentication.auditStatus===107008002||authentication.auditStatus===107008005">
          手工提交认证资料
        </el-button>
        <br/>
        <label class="f-fr f-text-red"
               v-if="authentication.auditStatus===107008005">审核不通过：{{authentication.description}}</label>
        <img src="../../assets/auditPass.png"
             v-if="authentication.auditStatus===107008004"/>
      </el-form-item>
    </el-form>
    <div>
      <truck-load-driver-authentication-info-create-dialog ref="truckLoadDriverAuthenticationInfoCreateDialog" v-on:commitSuccess="commitSuccessFun"></truck-load-driver-authentication-info-create-dialog>
    </div>
  </div>
</template>

<script>
import { isEmpty } from '../../lib/util.js';
import { changeDriveAuthenticationStatus } from '../../api/v3/TruckLoadDriver.js';
import TruckLoadDriverAuthenticationInfoCreateDialog from './TruckLoadDriverAuthenticationInfoCreateDialog.vue';

export default {
  components: {
    TruckLoadDriverAuthenticationInfoCreateDialog
  },
  props: {
    authenticationInfo: {
      type: Object
    }
  },
  watch: {
    authenticationInfo (val) {
      if (isEmpty(val.truckLoadDriverAuthenticationDTO)) {
        return;
      }
      this.authentication = val.truckLoadDriverAuthenticationDTO;
      this.loadTonAndLoadParty = (isEmpty(this.authentication.loadTon) ? '' : this.authentication.loadTon + '吨;') +
          (isEmpty(this.authentication.loadParty) ? '' : this.authentication.loadParty + '方');
    }
  },
  data () {
    return {
      authentication: {},
      loadTonAndLoadParty: null,
      description: null
    };
  },
  methods: {
    commitSuccessFun (val) {
      this.$emit('isShow', false);
      this.authentication = val;
    },
    createTruckLoadDriverAuthenticationInfoClick () {
      this.$refs.truckLoadDriverAuthenticationInfoCreateDialog.show(this.authentication);
    },
    affirmAuditClick (row) {
      let self = this;
      this.$prompt('已经核对了整车司机提交的认证资料或者认证部门已从第三方机构校验了认证资料的准确性, 是否继续?', '提示', {
        confirmButtonText: '确定审核通过',
        cancelButtonText: '审核不通过，重新申请',
        inputType: 'textarea',
        inputValidator: function (val) {
          self.description = val;
        }
      }).then(({value}) => {
        this.audit(107008004, true);
      }).catch(({value}) => {
        this.audit(107008005, true);
      });
    },
    audit (status, bo) {
      changeDriveAuthenticationStatus(this.authenticationInfo.id, status, this.description).then((res) => {
        console.log(res.data);
        if (res.status === 200) {
          this.authentication.auditStatus = status;
          this.$message.success('处理成功');
          this.searchTruckLoadDriverManageToFilters();
        } else {
          this.$message.error('处理失败');
        }
      });
    }
  },
  mounted () {}
};
</script>
